<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/common.css" />
		<link rel="stylesheet" type="text/css" href="css/navigation.css" />
		<link rel="stylesheet" href="layui/css/layui.css" media="all" />
		<link rel="stylesheet" type="text/css" href="css/usermessage.css" />
	</head>
	<body>
		<div class="typical_container">
			<div class="wrapper_search">
				<h2>个人信息 </h2> 
				<div class="typical_contentchange" style="display:block;">
					<a onclick="changemessgae()" style="cursor:pointer;"  ><img src="./img/usermessage/icon_edit@2x.png" style="width:12px; ">修改</a>
				</div>
			</div>
			
			<div class="typical_content" style="display:block;">
				<div class="messagetop">
					<div class="topleft">
                        <img src="./img/usermessage/usermessage.png" style="width:117px;">
					</div>
					<div class="topright"> 
                       <p id="showusername">-----</p>
					   <span id = "showrole">-----</span>
					</div>
				</div>
				<div class="messagecontent" >
                    <ul>
						<li>姓名<span id="showname">-----</span></li>
						<li>性别<span id="showusersex">-----</span></li>
						<li>手机<span id="showuserphone">-----</span></li>
						<li>邮箱<span id="showuseremail">-----</span></li>
						<li>备注<span id="showuserremarks">-----</span></li> 
					</ul>
				</div>
				
			</div>


			<div class="typical_contentone" style="display:none;">
				<div class="messagetop">
					<div class="topleft">
                        <img src="./img/usermessage/usermessage.png" style="width:117px;">
					</div>
					<div class="topright"> 
                       <p id="showuernamee">Admin</p>
					   <span id="showrolee">超级管理员</span>
					</div>
				</div>

				<div class="messagecontent" >
					<form class="layui-form" action="">
						<div class="layui-form-item">
						  <label class="layui-form-label">角色</label>
						  <div class="layui-input-block">
							<input disabled  type="text" name="role" id="hiddenrole" required  lay-verify="required" value="" autocomplete="off" class="layui-input">
						  </div>
						</div>
						<div class="layui-form-item">
							<label class="layui-form-label">姓名</label>
							<div class="layui-input-block">
							  <input disabled type="text" name="name" id="hiddenname" required  lay-verify="required" placeholder="请输入姓名" value="" autocomplete="off" class="layui-input">
							</div>
						  </div>
						
						<div class="layui-form-item">
						  <label class="layui-form-label">性别</label>
						  <div class="layui-input-block">
							<input type="checkbox" name="sex" id="men" value="1" title="男" lay-filter="oneCheck" lay-skin="primary" >
							<input type="checkbox" name="sex" id="women" value="0" title="女" lay-filter="oneCheck" lay-skin="primary">
						  </div>
						</div>
						<div class="layui-form-item">
							<label class="layui-form-label">手机</label>
							<div class="layui-input-block">
							  <input type="text" name="phone" id="hiddenphone" required  lay-verify="phone" placeholder="请输入手机号" value="" autocomplete="off" class="layui-input">
							</div>
						  </div>
						  <div class="layui-form-item">
							  <label class="layui-form-label">邮箱</label>
							  <div class="layui-input-block">
								<input type="text" name="email" id="hiddenemail" required  lay-verify="email" placeholder="请输入邮箱" value="" autocomplete="" class="layui-input">
							  </div>
							</div>
							<div class="layui-form-item">
								<label class="layui-form-label">备注</label>
								<div class="layui-input-block">
								  <input type="text" name="remarks" id="hiddenremarks" required  lay-verify="required" placeholder="请输入备注" value="" autocomplete="off" class="layui-input">
								</div>
							  </div>
						<div class="typical_contentchangeone" class="layui-form-item" style="display:block;">
						  <div class="layui-input-block">
							<a  onclick="returnmessgae()" type="reset" class="layui-btn layui-btn-primary" >
								<img src="./img/usermessage/icon_Undo@2x.png" style="width:12px; ">取消</a>
							<a class="layui-btn" lay-submit lay-filter="formDemo" class="layui-btn layui-disabled" >
								<img src="./img/usermessage/icon_save@2x.png" style="width:12px; ">保存</a>
						  </div>
						</div>
					  </form>
				</div>
				
				   
			</div>
		</div>
				<!-- <script src="./js/jquery.min.js"></script> -->
				<script src="layui/layui.all.js" type="text/javascript" charset="utf-8"></script>
				<!-- <script src="layui/layui.js" type="text/javascript" charset="utf-8"></script> -->
				<script src="./js/jquery.min.js"></script>
				<script src="js/usermessage.js"></script>
				<script>
					//Demo
				   
					var http = 'http://www.esunrising.net:8099/ords/kzks/api/';
		
					layui.use('form', function(){
					  var form = layui.form;
					  
					  //提交
					  form.on('submit(formDemo)', function(data){
						
					
						
						$.ajax({
					type: 'get',
					url: http + 'saveUserInfo',
					dataType: "json",
					data:{
						"user_id":localStorage.getItem('user_id'),
						"tel":data.field.phone,
						"remark":data.field.remarks,
						"gender":data.field.sex,
						"email":data.field.email,
					},
					async: true,
					success: function (result) {
						
						layer.msg('成功修改个人信息');
						var a = document.getElementsByClassName("typical_contentchange")[0];
		
						$(function () {
		  function setshowmessage(result) {
		
			document.getElementById("showname").innerHTML = result.name;
			document.getElementById("showusername").innerHTML = result.username;
			var sex = "";
			if (result.gender == 1) {
			  sex = "男";
			}
			if (result.gender == 0) {
			  sex = "女";
			}
		
			document.getElementById("showusersex").innerHTML = sex;
			document.getElementById("showuserphone").innerHTML = result.mobile;
			document.getElementById("showuseremail").innerHTML = result.email;
			document.getElementById("showuserremarks").innerHTML = result.remark;
		  }
		
		  var data = [];
		  $.ajax({
			type: "get",
			url: http + "user/"+localStorage.getItem('user_id'),
			dataType: "json",
			async: true,
			success: function (result) {
			  
			  setshowmessage(result);
			},
			error: function () {
			  console.log("访问失败");
			},
		  });
		});
		
		a.style.display = "block";
		
		var b = document.getElementsByClassName("typical_contentchangeone")[0];
		
		b.style.display = "none";
		
		var c = document.getElementsByClassName("typical_content")[0];
		
		c.style.display = "block";
		
		var d = document.getElementsByClassName("typical_contentone")[0];
		
		d.style.display = "none";
					},
					error: function () {
						console.log('访问失败');
						layer.msg('修改个人信息失败');
					}
				});
		
					  });
					});
		
					
				</script>
	</body>
</html>


